import { h, Component } from 'preact';

import { add, envoke, destory } from "@store";

import RectPanel from "./rect";
import ObjectRender from "./obj-panel";
import TextPanel from './text-panel';

import "@static:css/components/config/index.less";

const Card = ({title = '', children}) => {
    return <div className="c-properites">
                <div className="c-properites-title">
                    {title}
                </div>
                <div className="c-properites-body">
                    {children}
                </div>
            </div>
}

export default class ConfigPanel extends Component {

    state = {
        uuidL: null
    }

    id = "config";

    componentDidMount(){
        const { id } = this;
        add(id, 'updateRectId', uuid => {
            this.setState({
                uuid
            });
        })
    }

    componentWillUnmount(){
        const { id } = this;
        destory(id);
    }

    render(){
        const { uuid } = this.state;
        return <div>
            <Card title="矩形">
                <RectPanel uuid={uuid}  />
            </Card>
        </div>
    }
}